import React, {Component} from "react";
import {inject, observer} from "mobx-react";
import {observable, action} from "mobx";

@observer
class MainRecommendateAlumnu extends Component {
    constructor(props) {
        super(props);
        this.alumnuModel = this.props.store.getModel();
        this.state = {
            contactType: '',
            contactValue: ''
        }
    }

    @action handleChange = e => {
        switch (e.target.name) {
            case "recommended":
                this.alumnuModel.recommended = e.target.value;
                break;
            case "graduateYear":
                this.alumnuModel.graduateYear = e.target.value;
                break;
            case "majorName":
                this.alumnuModel.majorName = e.target.value;
                break;
            case "contactType":
                this.setState({
                    contactType: e.target.value
                });
                break;
            case "contactValue":
                this.setState({
                    contactValue: e.target.value
                });
                break;
            case "company":
                this.alumnuModel.company = e.target.value;
                break;
            case "duty":
                this.alumnuModel.duty = e.target.value;
                break;
            case "workAddress":
                this.alumnuModel.workAddress = e.target.value;
                break;
            case "brief":
                this.alumnuModel.brief = e.target.value;
                break;
        }
    };

    isEmpty = (obj) => {
        for (var name in obj) {
            return false;
        }
        return true;
    };

    @action add = () => {
        const {referrerNum, recommended, majorName, classes, phone, weChat, email, workAddress, duty, graduateYear, brief, company} = this.alumnuModel;
        if (this.isEmpty(recommended)) {
            alert("被推荐人姓名不能为空");
            return;
        }
        if (this.isEmpty(graduateYear)) {
            alert("请选择毕业年份");
            return;
        }
        if (this.isEmpty(majorName)) {
            alert("请选择专业");
            return;
        }
        if (this.isEmpty(this.state.contactValue)) {
            alert("联系方式" + this.state.contactType.toString() + "不能为空");
            return;
        }
        if (this.isEmpty(company)) {
            alert("工作单位不能为空");
            return;
        }
        if (this.isEmpty(brief)) {
            alert("简介不能为空");
            return;
        }
        switch (this.state.contactType) {
            case "phone":
                this.alumnuModel.phone = this.state.contactValue;
                break;
            case "weChat":
                this.alumnuModel.weChat = this.state.contactValue;
                break;
            case "email":
                this.alumnuModel.email = this.state.contactValue;
                break;
        }
        this.props.store.setModel(this.alumnuModel);
        this.props.store.recommendateAlumnu(this.alumnuModel);

    };

    render() {
        const {recommended, majorName, workAddress, duty, graduateYear, brief, company} = this.props.store.alumnuModel;
        return (
            <div>
                <div>推荐优秀校友</div>
                <div>
                    <label><span>*</span>被推荐人姓名：<input name="recommended" type="text" value={recommended} onChange={this.handleChange}/>
                    </label>
                </div>
                <div>
                    <label><span>*</span>毕业年份：
                        <select value={graduateYear} name="graduateYear" onChange={this.handleChange}>
                            <option value="" selected>--请选择年份--</option>
                            <option value="2006">2006</option>
                            <option value="2007">2007</option>
                            <option value="2008">2008</option>
                            <option value="2009">2009</option>
                            <option value="2010">2010</option>
                            <option value="2011">2011</option>
                            <option value="2012">2012</option>
                            <option value="2013">2013</option>
                            <option value="2014">2014</option>
                            <option value="2015">2015</option>
                            <option value="2016">2016</option>
                            <option value="2017">2017</option>
                            <option value="2018">2018</option>
                        </select>
                    </label>
                </div>
                <div>
                    <label><span>*</span>专业：
                        <select value={majorName} name="majorName" onChange={this.handleChange}>
                            <option value="" selected>--请选择专业--</option>
                            <option value="计算机科学与技术">计算机科学与技术</option>
                            <option value="网络工程">网络工程</option>
                            <option value="物联网工程">物联网工程</option>
                            <option value="信息安全">信息安全</option>
                            <option value="软件工程">软件工程</option>
                        </select>
                    </label>
                </div>
                <div>
                    <span>*</span>
                    <select value={this.state.contactType} name="contactType" onChange={this.handleChange}>
                        <option value="" selected>--请选择联系方式--</option>
                        <option value="phone">电话</option>
                        <option value="weChat">微信</option>
                        <option value="email">E-mail</option>
                    </select>
                    <label><input name="contactValue" type="text" value={this.state.contactValue}
                                  onChange={this.handleChange}/>
                    </label>
                </div>
                <div>
                    <label><span>*</span>工作单位：<input name="company" type="text" value={company}
                                                     onChange={this.handleChange}/>
                    </label>
                </div>
                <div>
                    <label>职务：<input name="duty" type="text" value={duty} onChange={this.handleChange}/>
                    </label>
                </div>
                <div>
                    <label>工作地址：<input name="workAddress" type="text" value={workAddress} placeholder="如：XXX省XXX市" onChange={this.handleChange}/>
                    </label>
                </div>
                <div>
                    <label><span>*</span>简介：<input name="brief" type="text" value={brief} onChange={this.handleChange}/>
                    </label>
                </div>
                <button onClick={this.add}>提交</button>
            </div>);
    }
}

export default observer(MainRecommendateAlumnu);